<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="keywords" content="AdminLTE,AdminEAP,AdminLTE框架">
    <meta name="description" content="基于AdminLTE的快速开发框架,让web开发更简单">
    <title>AdminEAP | 注册</title>
    <!-- Tell the browser to be responsive to screen width -->
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    <!--icon-->
    <link rel="shortcut icon" type="image/x-icon" href="${basePath}/resources/common/favicon.ico" media="screen"/>
    <!-- Bootstrap 3.3.6 -->
    <link rel="stylesheet" href="${basePath}/resources/adminlte/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="${basePath}/resources/common/libs/font-awesome/css/font-awesome.min.css">
    <!-- Ionicons -->
    <link rel="stylesheet" href="${basePath}/resources/common/libs/ionicons/css/ionicons.min.css">
    <!-- Theme style -->
    <link rel="stylesheet" href="${basePath}/resources/adminlte/dist/css/AdminLTE.min.css">
    <!-- iCheck -->
    <link rel="stylesheet" href="${basePath}/resources/adminlte/plugins/iCheck/square/red.css">
    <link rel="stylesheet"
          href="${basePath}/resources/adminlte/plugins/bootstrap-validator/dist/css/bootstrap-validator.css"/>

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<body class="hold-transition login-page">
<div class="login-box">
    <div class="login-logo">
        <a href="#"><b>Admin</b>EAP</a>
    </div>
    <!-- /.login-logo -->
    <div class="login-box-body">
        <p class="login-box-msg"><strong>新用户注册</strong></p>

        <form action="${basePath}/oauth/register" method="post" id="register-form">
            <input type="hidden" name="oAuthId" value="${oAuthInfo.oAuthId?default('-1')}">
            <input type="hidden" name="oAuthType" value="${oAuthInfo.oAuthType?default('-1')}">
            <div class="form-group has-feedback">
                <input type="text" class="form-control" name="name" id="name" placeholder="请输入用户名" required>
                <span class="glyphicon glyphicon-user form-control-feedback"></span>
            </div>
            <div class="form-group has-feedback">
                <input type="text" class="form-control" name="loginName" id="loginName" placeholder="请输入登录邮箱/登录名">
                <span class="glyphicon glyphicon-envelope form-control-feedback"></span>
            </div>
            <div class="form-group has-feedback">
                <input type="password" class="form-control" name="password" id="password" placeholder="请输入密码">
                <span class="glyphicon glyphicon-lock form-control-feedback"></span>
            </div>
            <div class="form-group has-feedback">
                <input type="password" class="form-control" name="repassword" id="repassword" placeholder="再次确认密码">
                <span class="glyphicon glyphicon-log-in form-control-feedback"></span>
            </div>
            <div class="row">
                <div class="col-xs-12">
                    <div class="checkbox icheck">
                        <label>
                            <input type="checkbox" id="agreement" class="icheck" required> 同意遵循<a href="#">AdminEAP协议</a>
                        </label>
                    </div>
                </div>
                <!-- /.col -->
            </div>
            <div class="row">
                <div class="col-xs-12">
                    <button type="submit" class="btn btn-danger btn-block btn-flat">注 册</button>
                </div>
            </div>
        </form>
    </div>
</div>
<!-- jQuery 2.2.3 -->
<script src="${basePath}/resources/adminlte/plugins/jQuery/jquery-2.2.3.min.js"></script>
<!-- Bootstrap 3.3.6 -->
<script src="${basePath}/resources/adminlte/bootstrap/js/bootstrap.min.js"></script>
<!-- iCheck -->
<script src="${basePath}/resources/adminlte/plugins/iCheck/icheck.min.js"></script>
<!-- bootstrap-validator-->
<script src="${basePath}/resources/adminlte/plugins/bootstrap-validator/dist/js/bootstrap-validator.js"></script>
<!--<script type="text/javascript" src="${basePath}/resources/common/js/base.js"></script>-->
<script type="text/javascript" src="${basePath}/resources/common/js/base-modal.js"></script>
<script>
    $(function () {
        $('input.icheck').iCheck({
            checkboxClass: 'icheckbox_square-red',
            radioClass: 'iradio_square-red',
            increaseArea: '20%' // optional
        });

        $("#register-form").bootstrapValidator({
            submitHandler: function (valiadtor, loginForm, submitButton) {
                if(!$("#agreement").is(":checked")){
                    modals.info("请先勾选同意遵循AdminEAP协议");
                    return;
                }
                valiadtor.defaultSubmit();
            },
            fields: {
                name: {
                    validators: {
                        notEmpty: {
                            message: '用户名不能为空'
                        },
                        stringLength: {
                            /*长度提示*/
                            min: 2,
                            max: 15,
                            message: '用户名长度必须在2到15之间'
                        }
                    }
                },
                loginName: {
                    validators: {
                        notEmpty: {
                            message: '登录邮箱名或用户名不能为空'
                        },
                        stringLength: {
                            /*长度提示*/
                            min: 4,
                            max: 30,
                            message: '用户名长度必须在4到30之间'
                        },
                        threshold: 4,//只有4个字符以上才发送ajax请求
                        remote: {
                            url: "${basePath}/oauth/checkUnique",
                            data: function (validator) {
                                return {
                                    loginName: $("#loginName").val(),
                                    userId: null
                                };
                            },
                            message: '该登录名已被使用，请使用其他登录名',
                            delay:2000
                        }
                    }
                },
                password: {
                    validators: {
                        notEmpty: {
                            message: '密码不能为空'
                        },
                        stringLength: {
                            /*长度提示*/
                            min: 6,
                            max: 30,
                            message: '密码长度必须在6到30之间'
                        },
                        different: {//不能和用户名相同
                            field: 'loginName',//需要进行比较的input name值
                            message: '不能和用户名相同'
                        },
                        regexp: {
                            regexp: /^[a-zA-Z0-9_\.]+$/,
                            message: '密码由数字字母下划线和.组成'
                        }
                    }
                },
                repassword: {
                    message: '密码无效',
                    validators: {
                        notEmpty: {
                            message: '密码不能为空'
                        },
                        stringLength: {
                            min: 6,
                            max: 30,
                            message: '用户名长度必须在6到30之间'
                        },
                        identical: {//相同
                            field: 'password',
                            message: '两次密码不一致'
                        },
                        different: {//不能和用户名相同
                            field: 'loginName',
                            message: '不能和用户名相同'
                        },
                        regexp: {//匹配规则
                            regexp: /^[a-zA-Z0-9_\.]+$/,
                            message: '密码由数字字母下划线和.组成'
                        }
                    }
                }

            }
        });

    });


</script>
</body>
</html>
